<template>
  <div class="app-container">
    <div>
      <div class="project-show">
        <h3>请选择一上预算编制</h3>
        <div class="project-show-per">
          <el-input v-model="twoProjectObjName" placeholder="请选择一上预算编制" @focus="openSelectModel" suffix-icon="Search" readonly />
        </div>
      </div>
      <el-divider />
      <div v-if="budgetOne && budgetOne.id">
<!--        <budgetOneDetail v-model:budgetOneId="budgetOne.id"></budgetOneDetail>-->
        <budgetOnePreview v-model:budgetOneId="budgetOne.id"></budgetOnePreview>
      </div>
      <!-- <div class="btns" v-if="budgetOne && budgetOne.id">
        <el-button type="primary">导出</el-button>
        <el-button type="primary">打印</el-button>
      </div> -->
    </div>
    <selectBudgetOneList v-model:itemsVisible="itemsVisible" @close="itemsVisible = false" @budgetOneSelect="changeBudgetOne"></selectBudgetOneList>
  </div>
</template>

<script>
import baseConfig from '@/mixins/baseConfig'
import {doGet} from '@/config/http'
import selectBudgetOneList from '@/views/components/budget/selectBudgetOneList.vue'
import budgetOnePreview from '@/views/components/budget/budgetOnePreview.vue'

const props = { multiple: true }
const emptyObj = {}

export default {
  name: 'budgetOneCollectEdit1_nocache',
  mixins: [baseConfig],
  components: {
    budgetOnePreview,
    selectBudgetOneList,
  },
  data() {
    return {
      oneProject: '',
      twoProject: '',
      isShowProject: false,
      svc: 'icims-api',
      obj: Object.assign({}, emptyObj),
      routes: [],
      checkStrictly: false,
      defaultProps: {
        children: 'children',
        label: 'title'
      },
      total: 0,
      listLoading: false,
      listQuery: {},
      selectionList: [],
      dialogFormVisible: false,
      dialogStatus: '',
      twoProjectObj: null,
      twoProjectObjName: '',
      budgetOne: null,
      itemsVisible: false,
      rules: {},
    }

  },
  computed: {
    routesData() {
      return this.routes
    },
  },
  created() {
  },
  methods: {
    async doConfirm(formName) {
    },
    openSelectModel() {
      this.itemsVisible = true
    },
    changeBudgetOne(data) {
      this.twoProjectObj = data
      this.twoProjectObjName = data.name
      doGet(this.svc, '/budget-one/' + data.id, {}, true).then(res => {
        this.budgetOne = res
      })
    },
  }
}
</script>
<style>
.textarea-1 .el-textarea__inner{
  /* pointer-events: none; */
  border: none !important;
  resize: none !important;
  outline: none !important;
  border-radius: 0 !important;
}
.form-table-textarea .el-form-item__content{
  /* width: 100%; */
  padding:0;
  margin-left: 0 !important;
}
</style>
<style scoped>
.table-form {
  border-collapse: collapse;
  text-align:center;
}
.el-popper {
  overflow: hidden;
}
.form-list-content-1 .el-form-item__label {
  width: 11.25rem !important;
}
.table-form .form-table-textarea {
  margin-bottom:  0 !important;
}
.textarea-1 .el-textarea__inner{
  /* pointer-events: none; */
  border: none !important;
  resize: none !important;
  outline: none !important;
  border-radius: 0 !important;
}
.btns {
  margin: 1.875rem 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.project-show-per {
  display: flex;
  align-items: center;
}
.project-show {
  margin-left: 20px;
}
.project-show-title {
  color: #337ecc;
  padding-left: 10px;
}
.indexs {
  display: flex;
  flex-wrap: wrap;
}
.index-list {
  margin: 0 20px
}
.index-list h3 {
  font-weight: bold;
  /* text-align: center; */
}
.content-per {

}
.index-list-content {
  display: flex;
  align-items: center;
}
.content-text {
  width: 300px;
  /* background: red; */
}
.index-list-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.query-per {
  display: flex;
  align-items: center;
}
.query-per .el-button {
  margin-left: 20px;
}
.project-show-per .el-input {
  width: 500px !important;
}
</style>
